<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>axios-options</title>
</head>
<body>
<script src="node_modules/axios/dist/axios.min.js"></script>
<script>
  //公共配置
  axios.defaults.baseURL = 'http://localhost:3000';//基础路径
  axios.interceptors.response.use((res) => res);//设置拦截器直接获得data

  //axios.defaults.headers = {}//请求头
  axios.defaults.timeout = 3000;//超时时间
  axios.defaults.validateStatus = status => /^(2|3)\d{2}/.test(status)//自定义状态码成功规则

  //修改响应头用，一般用不到
  //设置在POST请求中基于请求主体向服务器发送内容的格式，默认RAW，常用URL-ENCODEED
  //效果： {id:1,sex:2} -> id=1&sex=2
  // axios.defaults.headers['Content-Type'] = 'appliction/x-www-form-urlencoded';
  // axios.defaults.transformRequest = data =>{
  //   let str = ``;
  //   for(let key in data){
  //     if(data.hasOwnProperty(key)){
  //       str += `${key}=${data[key]}&`
  //     }
  //   }
  //   return str.substring(0,str.length-1);
  // }

  //get请求传参
  axios.get('/book',{
    params:{
      id:1
    },
    //timeout:2000,//单独配置
    //headers:{xxx:'xxx'}
  }).then(data=>{
    console.log(data)
  })

  //post可以传三个参数，最后一个是配置项
  axios.post('/add',{
      id:1,
      sex:2
    }
    //{
    //  timeout:2000,//单独配置
    //  headers:{xxx:'xxx'}
    //}
  ).then(data=>{
    console.log(data)
  })

  //all合并请求
  let arr = [
    axios.get('/category'),
    axios.get('/getSlider')
  ]
  axios.all(arr).then(res=>{
    //res是一个数组，两个请求都完成才有结果
    console.log(res)
    let [resA,resB] = res
  })
  axios.all(arr).then(axios.spread((resA,resB)=>{
    //可以用axios.spread分别拿到，柯理化函数
    console.log(resA,resB)
  }))

  </script>
</body>
</html>